<template>
    <div>
        <h4>组件篇-事件总线</h4>

        <rece></rece>
        <!-- 数据传递方 -->
        <button @click="busClick">传递数据</button>
    </div>
</template>

<script setup>
/**
 * 事件总线：我们希望实现非父子间的通信、除了使用inject和provide、还可以通过事件总线的方式
 *     事件总线的实现方式：npm install --save mitt 第三方库
 */
import rece from './rece.vue';
import bus from './Bus.js'

import { ref } from 'vue';

const message = ref({
    name: 'zhangsan',
    age: 20
})


// 通过事件总线传递数据
function busClick() {
    bus.emit('car', message)
}



</script>

<style lang="scss" scoped></style>